<app-common-header [title]="'myAccount.setting.language.title'|translate"></app-common-header>
<ion-content>
  <ion-searchbar class="search-icon" showCancelButton="always" 
                 [(ngModel)]="name" 
                 (ionChange)="searchLanguage()" 
                 placeholder="{{'myAccount.setting.language.search' | translate}}" 
                 cancelButtonText="{{'myAccount.setting.language.cancel' | translate}}">
  </ion-searchbar>
  <ion-list>
    <ion-item *ngFor="let item of languageList" [hidden]="!item.isShow" (click)="selectLanguage(item)">
      <ion-label class="language-name">{{item.name}}</ion-label>
      <!-- <ion-icon  slot="end" name="checkmark-outline" [hidden]="!item.checked"></ion-icon> -->
      <div name="checkmark-outline" [hidden]="!item.checked">
        <svg class="icon"  aria-hidden="true">
            <use xlink:href="#iconapprove"></use>
        </svg>
      </div>
    </ion-item>
  </ion-list>
</ion-content>
